<template>
  <div class="app">
    <div style="margin: 10px;">
      <sd-button>默认按钮</sd-button>
      <sd-button type="primary">主要按钮</sd-button>
      <sd-button type="success" :loading="true">成功按钮</sd-button>
      <sd-button type="info">信息按钮</sd-button>
      <sd-button type="warning">警告按钮</sd-button>
      <sd-button type="danger">危险按钮</sd-button>
    </div>
    <div style="margin: 10px;">
      <sd-button plain disabled>默认按钮</sd-button>
      <sd-button type="primary" plain :loading="true">主要按钮</sd-button>
      <sd-button type="success" plain>成功按钮</sd-button>
      <sd-button type="info" plain>信息按钮</sd-button>
      <sd-button type="warning" plain>警告按钮</sd-button>
      <sd-button type="danger" plain>危险按钮</sd-button>
    </div>
    <div style="margin: 10px;">
      <sd-button plain icon="iconnainiumao" circle></sd-button>
      <sd-button type="primary" icon="iconnainiumao" plain></sd-button>
      <sd-button type="success" icon="iconnainiumao" round :loading="true"></sd-button>
    </div>
    <div style="margin: 10px;">
      <sd-button :loading="true">默认大小</sd-button>
      <sd-button size="medium" type="primary" :loading="true">大</sd-button>
      <sd-button size="small" type="primary">中</sd-button>
      <sd-button size="mini" type="primary" @click="test">小</sd-button>
    </div>
  </div>
</template>

<script>
  export default {
    methods: {
      test(e) {
        console.log('test', e)
      }
    }
  }
</script>

<style scoped>
::v-deep .sd-button {
  margin: 5px !important;
}
</style>
